<!--
 * @Author: your name
 * @Date: 2021-09-05 12:50:37
 * @LastEditTime: 2021-09-05 16:19:20
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \static\pc\addActive.html
-->
<!DOCTYPE html>
<html lang="zh">

<head>
  <meta charset="UTF-8">
  <title>抱团员工端</title>
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no,minimal-ui,viewport-fit=cover"/>
  <meta name="keywords" content="抱团">
  <meta name="description" content="抱团">
  <script type='text/javascript' src="../common/js/base.js" charset="UTF-8"></script>
  <link rel="stylesheet" type="text/css" href="../common/css/theme-chalk/index.css">
  <link rel="stylesheet" type="text/css" href="../common/css/animate.min.css">
  <link rel="stylesheet" type="text/css" href="../common/css/nanoscroller.css">
  <link rel="stylesheet" type="text/css" href="../common/css/swiper-bundle.min.css">
  <link rel="stylesheet" type="text/css" href="../common/css/base.css">
  <link rel="stylesheet" type="text/css" href="css/style_pc.css">
  <link rel="stylesheet" type="text/css" href="css/style_mobile.css">
  <script type='text/javascript' src="../common/js/jquery.min.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/jquery.easing.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/html2canvas.min.js" charset="UTF-8"></script>
  <script type="text/javascript" src="../common/js/layer/layer.js" charset="UTF-8"></script>
  <script type="text/javascript" src="../common/js/wow.js" charset="UTF-8"></script>
  <script type="text/javascript" src="../common/js/vue.js" charset="UTF-8"></script>
  <script type="text/javascript" src="../common/js/vue-resource.js" charset="UTF-8"></script>
  <script type="text/javascript" src="../common/js/axios.min.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/elementui.min.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/jquery.nanoscroller.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/swiper.animate.min.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/swiper-bundle.min.js" charset="UTF-8"></script>
  <script type='text/javascript' src="../common/js/helper.js" charset="UTF-8"></script>

  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>

<body>
<div class="page addActive hasmenu" id="app">
  <div class="pc">
    <div class="TopNav">
      <div class="logo"><span>抱团 |</span> 活动信息提报系统</div>
      <div class="loginOut" v-on:click="logout">退出</div>
    </div>
    <div class="mainBox">
      <div class="main">
        <div class="top">
          <div class="item" :class="{active:flag==1}">01. <span>填写商家信息</span></div>
          <div class="colorBlock"></div>
          <div class="item" :class="{active:flag==2}">02. <span>填写活动信息</span></div>
          <div class="colorBlock"></div>
          <div class="item" :class="{active:flag==3}">03. <span>提交完成</span></div>
        </div>
        <div class="form" v-if="flag==1">
          <div class="item">
            <div class="des">商家名称：</div>
            <input type="text">
            <div class="btn"></div>
          </div>
          <div class="item">
            <div class="des">商家类型：</div>
            <div style="position: relative;">
              <select>
                <option value="volvo">Volvo</option>
                <option value="saab">Saab</option>
                <option value="opel">Opel</option>
                <option value="audi">Audi</option>
              </select>
              <i class="icon"></i>
            </div>
          </div>
          <div class="item">
            <div class="des">联系人姓名：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">手机号：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">门店名称：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">门店地址：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">门店电话：</div>
            <input type="text">
          </div>
          <div class="tips">添加门店 +</div>
          <div class="nextBtn" @click="flag=2">下一步</div>
        </div>
        <div class="form form2" v-if="flag==2">
          <div class="til">填写时间信息</div>
          <div class="item">
            <div class="des">上线时间段：</div>
            <div class="inputBox">
              <el-date-picker
                      v-model="time1"
                      type="datetime"
                      placeholder="开始时间">
              </el-date-picker>
              <div class="colorL"></div>
              <el-date-picker
                      v-model="time2"
                      type="datetime"
                      placeholder="结束时间">
              </el-date-picker>
            </div>
          </div>
          <div class="item">
            <div class="des">使用时间段：</div>
            <div class="inputBox">
              <el-date-picker
                      v-model="time3"
                      type="datetime"
                      placeholder="开始时间">
              </el-date-picker>
              <div class="colorL"></div>
              <el-date-picker
                      v-model="time4"
                      type="datetime"
                      placeholder="结束时间">
              </el-date-picker>
            </div>
          </div>
          <div class="til">填写套餐一信息</div>
          <div class="item">
            <div class="des">原价格：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">销售价格：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">商家结算价格：</div>
            <input type="text">
          </div>
          <div class="item">
            <div class="des">库存数量：</div>
            <input type="text">
          </div>
          <div class="item item_">
            <div class="des">服务内容：</div>
            <textarea name="" id="" cols="30" rows="10"></textarea>

          </div>
          <div class="tips_">
            <div>添加套餐 +</div>
            <div style="color: #000000;">点击后显示填写套餐二信息</div>
          </div>

          <div class="til">填写活动规则</div>
          <div class="item">
            <div class="des">是否限购：</div>
            <div class="redioBox">
              <div class="redioBoxItem" @click="activeFlag=true">
                <div class="img yhafter" :class="{active:activeFlag}"></div>
                <div>否</div>
              </div>
              <div class="redioBoxItem" @click="activeFlag=false">
                <div class="img yhafter" :class="{active:!activeFlag}"></div>
                <div>是</div>
              </div>
              <div class="redioBoxItem">
                <div>填写限购几份</div>
                <input type="text">
              </div>
            </div>
          </div>
          <div class="item">
            <div class="des">是否提前预约：</div>
            <div class="redioBox">
              <div class="redioBoxItem" @click="activeFlag1=true">
                <div class="img yhafter" :class="{active:activeFlag1}"></div>
                <div>否</div>
              </div>
              <div class="redioBoxItem" @click="activeFlag1=false">
                <div class="img yhafter" :class="{active:!activeFlag1}"></div>
                <div>是</div>
              </div>
            </div>
          </div>

          <div class="til">提交图片信息</div>
          <div class="item">
            <div class="des">上传图片：</div>
            <input type="text" style="width: 300px;">
            <div class="imgbtn">上传</div>
          </div>
          <div class="imgTips">请上传压缩包文件</div>


          <div class="nextBtn" @click="flag=3">提交</div>
        </div>
        <div class="form form3" v-if="flag==3">
          <img src="images/succ.png" alt="">
          <div class="form3Tips">提交成功</div>
          <div class="nextBtn" @click="flag=1">继续填写</div>
        </div>
      </div>
      <div class="bottomTips">版权所有：北京梵道千途科技有限公司 京ICP备 xxxxxxxx号</div>
    </div>

  </div>
  <div class="phone">
    <div class="form1" v-if="flag==1">
      <div class="til">
        <div>添加活动</div>
        <div>01.填写商家信息</div>
      </div>
      <div class="list">
        <div class="item">
          <input type="text" class="input_" placeholder="商家名称">
          <div class="btn"></div>
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="商家类型">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="联系人姓名">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="手机号 ">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="门店名称">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="门店地址">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="门店电话">
        </div>
        <div class="addtips">添加门店 +</div>
        <div class="nextBtn" @click="flag=2">下一步</div>
      </div>
    </div>
    <div class="form1 form2" v-if="flag==2">
      <div class="til">
        <div>添加活动</div>
        <div>02.填写活动信息</div>
      </div>
      <div class="list">
        <div class="til_">填写时间信息</div>
        <div class="item">
          <el-date-picker
                  v-model="time1"
                  type="datetime"
                  placeholder="上线开始时间">
          </el-date-picker>
        </div>
        <div class="item">
          <el-date-picker
                  v-model="time2"
                  type="datetime"
                  placeholder="上线结束时间">
          </el-date-picker>
        </div>
        <div class="item">
          <el-date-picker
                  v-model="time3"
                  type="datetime"
                  placeholder="使用开始时间">
          </el-date-picker>
        </div>
        <div class="item">
          <el-date-picker
                  v-model="time4"
                  type="datetime"
                  placeholder="使用结束时间">
          </el-date-picker>
        </div>

        <div class="til_">填写套餐一信息</div>
        <div class="item">
          <input type="text" class="input" placeholder="填写原价格">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="填写销售价格">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="填写商家结算价格">
        </div>
        <div class="item">
          <input type="text" class="input" placeholder="填写库存数量">
        </div>
        <div class="item">
          <textarea class="input" style="height: 3rem;padding: 0.3rem;" placeholder="填写服务内容"></textarea>
        </div>
        <div class="addtips">添加套餐 +</div>

        <div class="til_">填写活动规则</div>
        <div class="item_">
          <div class="des">是否限购：</div>
          <div class="redioBox">
            <div class="redioBoxItem" @click="activeFlag=true">
              <div class="img yhafter" :class="{active:activeFlag}"></div>
              <div>否</div>
            </div>
            <div class="redioBoxItem" @click="activeFlag=false">
              <div class="img yhafter" :class="{active:!activeFlag}"></div>
              <div>是</div>
            </div>
            <div class="redioBoxItem">
              <div>填写限购几份</div>
              <input type="text">
            </div>
          </div>
        </div>
        <div class="item_">
          <div class="des">是否提前预约：</div>
          <div class="redioBox">
            <div class="redioBoxItem" @click="activeFlag1=true">
              <div class="img yhafter" :class="{active:activeFlag1}"></div>
              <div>否</div>
            </div>
            <div class="redioBoxItem" @click="activeFlag1=false">
              <div class="img yhafter" :class="{active:!activeFlag1}"></div>
              <div>是</div>
            </div>
          </div>
        </div>

        <div class="til_">提交图片信息</div>
        <div class="subImg"></div>

        <div class="nextBtn" @click="flag=3">下一步</div>
      </div>
    </div>
    <div class="form1 form3" v-if="flag==3">
      <img src="images/succ.png" alt="">
      <div class="form3Tips">提交成功</div>
      <div class="nextBtn" @click="flag=1">继续填写</div>
    </div>
    <!-- 弹出层 -->
    <div class="mb" v-if="0">
      <div class="alertBox" v-if="0">
        <div class="dex">库中无此商家，请认真填写信息</div>
        <div class="btnlsit">
          <div class="close btn">关闭</div>

        </div>
      </div>
      <div class="alertBox" v-if="0">
        <div class="dex">库中已录入此商家，可直接导入 商家信息</div>
        <div class="btnlsit">
          <div class="btn">导 入</div>
          <div class="btn btn_">关 闭</div>

        </div>
      </div>

    </div>
  </div>
</div>

<div class="indexbotmenu">
    <a href="./userIndex.html" class="item">
        <div class="img"><img src="images/index-botmenu-ico1.png" alt=""></div>
        <p>首页</p>
    </a>
    <a href="./profits.html" class="item">
        <div class="img"><img src="images/index-botmenu-ico2.png" alt=""></div>
        <p>收益</p>
    </a>
<!--    <a href="./pc_add_active.html" class="item">-->
<!--        <div class="img"><img src="images/index-botmenu-ico3-select.png" alt=""></div>-->
<!--        <p>添加活动</p>-->
<!--    </a>-->
    <a href="./activity.html" class="item">
        <div class="img"><img src="images/index-botmenu-ico4.png" alt=""></div>
        <p>商家</p>
    </a>
</div>
</body>
<script>
  $(function () {
    var api = 'http://gyhlwdh.niceui.cn';
    new Vue({
      el: '#app',
      data() {
        return {
          serachtxt: '',
          flag: 1,
          value1: "",
          activeFlag: true,
          activeFlag1: true,
          time1:'',
          time2:'',
          time3:'',
          time4:'',
        }
      },
      mounted() {
        wow = new WOW({
          animateClass: 'animated',
          offset: 0
        });
        wow.init();
        var that = this;
        that.getdata();
      },
      methods: {
        logout: function () {
          window.location.href = 'pc_login.html'
        },
        getdata: function () {
          var that = this;
          // axios.get(api+'/api/alliance/'+code).then(res => {
          //     // console.log(res)
          //     if(res.status==200){
          //         res.data.intro_chage=res.data.intro.split('\n');
          //         var strarr=res.data.intro_chage;
          //         var str='';
          //         $(strarr).each((i,v)=>{
          //             str+='<span>';
          //             str+=v;
          //             str+='</span>';
          //         })
          //         res.data.intro_chage=str;
          //         that.data=res.data;
          //     }
          // }).catch(function (error) {console.log('获取基础信息：'+error);});
        },
      }
    });
  })
</script>

</html>
